<!DOCTYPE html>
<html>
<head>
    <title>{$info['name']} {$site_info.site_name|default=''}</title>
    <include file="public@head"/>
    <include file="student/public@head"/>
    <link href="__STATIC__/swiper/swiper.min.css" rel="stylesheet" type="text/css">
    <link href="__STATIC__/student/css/liveing.css?t=1590716666" rel="stylesheet" type="text/css">
</head>
<body>
    <div class="liveing">
        <div class="liveing_top">
            <div class="l_top_l">
                <div class="live_tips">
                    <if condition="$info['islive'] eq 0">
                        <div class="live_time">倒计时：<span class="js_time">0天00时00分00秒</span></div>
                    </if>
                    <div class="live_status">
                        <if condition="$info['islive'] eq 1"/>
                            <text style="color: #3DD1A2;">直播中</text>
                        <elseif condition="$info['islive'] eq 2"/>
                            直播已结束
                        </if>
                    </div>
                </div>
            </div>
            <div class="l_top_c">
                {$info['name']}
            </div>
            <div class="l_top_r">
                <div class="live_nums"><span class="img"></span><span id="js_usernums">{$info['nums']}</span></div>
                <img src="{$userinfo['avatar']|default=''}" class="l_top_r_a">
                <p class="l_top_s">{$userinfo['user_nickname']|default=''}</p>
            </div>
        </div>
        <div class="liveing_c clearfix">
            <if condition="$info['islive'] eq 0"/>
                <div class="liveing_c_status">直播还未开始</div>
            <elseif condition="$info['islive'] eq 2"/>
                <div class="liveing_c_status">直播已结束</div>
            </if>

            <div class="liveing_c_l">
                <if condition="$info['livetype'] eq 5 && $info['user_type'] eq 1">
                <div class="live_control_list">
                    <ul>
                        <li class="on js_camera">
                            <div class="img">
                                <img src="__STATIC__/student/images/liveing/camera.png">
                            </div>
                            <div class="title">
                                摄像头
                            </div>
                        </li>
                        
                        <li class="js_ware">
                            <div class="img">
                                <img src="__STATIC__/student/images/liveing/ware.png">
                            </div>
                            <div class="title">
                                课件
                            </div>
                        </li>
                        
                        <li class="js_share">
                            <div class="img">
                                <img src="__STATIC__/student/images/liveing/share.png">
                            </div>
                            <div class="title">
                                屏幕共享
                            </div>
                        </li>
                    </ul>
                </div>
                </if>
            </div>
            <div class="liveing_c_c">
                <div class="liveing_play">
                    <if condition="$info['livetype'] eq 1 || $info['livetype'] eq 5">
                    <div id="ppt_show" class="hide">
                        <div class="swiper-container gallery-top">
                            <div class="swiper-wrapper">
                                <volist name="info.ppts" id="v">
                                <div class="swiper-slide ppt_{$v['id']}" style="background-image:url({$v['thumb']})"></div>
                                </volist>
                            </div>
                            <div class="swiper-button-next swiper-button-white"></div>
                            <div class="swiper-button-prev swiper-button-white"></div>
                        </div>
                    </div>
                    </if>
                    <if condition="$info['livetype'] neq 1"/>
                        <img class="live_play" src="__STATIC__/student/images/liveing/live_play.png">
                        <div id="liveing_play_bd"></div>
                    </if>
                    
                    <if condition="$info['livetype'] eq 5"/>
                        <div id="screen"></div>
                    </if>
                </div>
                
                <div class="liveing_c_c_b">
                    <div class="ppt_list_title">
                        <ul>
                            <li class="on js_ppt_title">
                            <if condition="$info['livetype'] eq 1">
                            课件直播中
                            </if>
                            <if condition="$info['livetype'] eq 2"/>
                            视频课件直播
                            </if>
                            <if condition="$info['livetype'] eq 3"/>
                            音频课件直播
                            </if>
                            <if condition="$info['livetype'] eq 5"/>
                            摄像头直播中
                            </if>
                            </li>
                        </ul>
                        <if condition="$info['livetype'] eq 1 || $info['livetype'] eq 5">
                            <div class="ppt_list_add ppt_add">
                                添加课件
                            </div>
                        </if>
                    </div>
                    <div class="ppt_list">
                        <div class="swiper-container gallery-thumbs">
                            <div class="swiper-wrapper  ">
                                <volist name="info.ppts" id="v">
                                <div class="swiper-slide ppt_{$v['id']}" >
                                    <div class="ppt_list_u" style="background-image:url({$v['thumb']})">
                                    <if condition="$info['user_type'] eq 1">
                                        <div class="ppt_del" data-pptid="{$v['id']}">删除</div>
                                    </if>
                                    </div>
                                    <div class="ppt_list_t">
                                        {$i}
                                    </div>
                                </div>
                                </volist>
                                
                                <if condition="$info['user_type'] eq 1 && ($info['livetype'] eq 1 || $info['livetype'] eq 5) && !$info['ppts']">
                                <div class="swiper-slide" >
                                    <div class="ppt_list_add ppt_add">
                                        <div class="ppt_list_add_img add_ppt"></div>
                                        <div class="ppt_list_add_t">
                                        打开课件
                                        </div>
                                    </div>
                                </div>
                                </if>
                                
                                <if condition="$info['user_type'] eq 1 && $info['livetype'] eq 3 ">
                                <div class="swiper-slide" >
                                    <div class="ppt_list_add">
                                        <div class="ppt_list_add_img add_audio"></div>
                                    </div>
                                </div>
                                </if>
                                
                                <if condition="$info['user_type'] eq 1  && $info['livetype'] eq 2 ">
                                <div class="swiper-slide" >
                                    <div class="ppt_list_add">
                                        <div class="ppt_list_add_img add_video"></div>
                                    </div>
                                </div>
                                </if>
                            </div>
                        </div>
                        <if condition="$info['livetype'] eq 1 || $info['livetype'] eq 5">
                        <div class="swiper-button-next swiper-button-white"></div>
                        <div class="swiper-button-prev swiper-button-white"></div>
                        </if>
                    </div>
                    <div style="display:none;" id="upload"></div>
                    <if condition="$info['livetype'] eq 1 && $info['user_type'] eq 1">
                        <div class="ppt_tips"> 上传图片作为ppt使用，悬浮鼠标删除图片 </div>
                    </if>
                </div>
            </div>
            <div class="liveing_c_r">
                <if condition="$info['livetype'] eq 5">
                <div id="liveing_play_bd_s"></div>
                <div class="shareing">
                    <div class="shareing_img"></div>
                    <div class="shareing_t">屏幕共享中</div>
                </div>
                </if>
                <!-- <if condition="$info['livetype'] neq 5"> -->
                <if condition="$info['livetype'] eq -1">
                    <div class="liveing_audio">
                        <div class="audio_start">
                            <div class="js_audio_img"></div>
                            <div class="js_audio_title">单击开始录音</div>
                        </div>
                        
                        <div class="audio_ing hide">
                            <div class="js_audio_img">
                                <span class="audio_btn audio_cancel">取消</span>
                                <div class="js_audio_time">
                                    <span>00:00</span>
                                </div>
                                <span class="audio_btn audio_ok">完成</span>
                            </div>
                            
                            <div class="time_tip">最多录制10分钟</div>
                        </div>
                        
                        <div class="audio_end hide">
                            <div class="js_audio_img">
                                <span class="audio_btn audio_cancel">取消</span>
                                <div class="js_audio_time"></div>
                                <span class="audio_btn audio_send">发送</span>
                            </div>
                        </div>
                        
                        <div class="audio_error hide">
                            <div class="js_audio_img"></div>
                            <div class="js_audio_title">当前设备或浏览器不支持录音<br>请更换设备或浏览器后重试</div>
                        </div>
                        
                    </div>
                </if>
                <div class="liveing_c_r_tab">
                    <ul>
                        <li class="on" data-type="1">讲师区</li>
                        <li data-type="0">讨论区</li>
                        <li data-type="2">问答区</li>

                    </ul>
                </div>
                <div class="liveing_c_r_tab_b">
                    <div class="liveing_c_r_tab_bd">
                        <div class="msg" id="js_msg_explain">
                            <ul>
                                <!-- <li>
                                    <div class="msg_n"><img src="/logo.png"><span>昵称</span><span>讲师</span></div>
                                    <div class="msg_p">
                                        <div class="msg_audio">
                                            <div class="msg_c_audio">
                                                <i></i> <span>5”</span>
                                                <audio preload="auto" src=""></audio>
                                            </div>
                                        </div>
                                    </div>
                                </li> -->
                                <!-- <li>
                                    <div class="msg_n"><img src="/logo.png"><span>昵称</span><span>讲师</span></div>
                                    <div class="msg_p">
                                        <div class="msg_c">啊<img class="emoji" src="/static/emoji/img/666.png" ></div>
                                    </div>
                                </li> -->
                                <!-- <li class="msg_right qa on">
                                    <div class="msg_n"><img src="/logo.png"><span>昵称</span><span>讲师</span></div>
                                    <div class="msg_p">
                                        <div class="msg_c">啊</div>
                                    </div>
                                    <div class="qa_b" data-chatid="1" data-touid="1" data-toname="1" data-content="1">
                                        <button>回复</button>
                                    </div>
                                </li> -->
                                
                                <!-- <li class="msg_right">
                                    <div class="msg_n"><img src="/logo.png"><span>昵称</span><span>讲师</span></div>
                                    <div class="msg_p">
                                        <div class="msg_c">啊</div>
                                    </div>
                                </li> -->
                                <!-- <li>
                                    <div class="msg_n"><img src="/logo.png"><span>昵称</span><span>讲师</span></div>
                                    <div class="msg_p">
                                        <div class="msg_c">
                                            <div class="msg_c_r">
                                                <div class="msg_c_r_b"></div>
                                                <div class="msg_c_r_c">
                                                    <div class="msg_c_r_c_n">昵称</div>
                                                    <div class="msg_c_r_c_c">内容</div>
                                                </div>
                                            </div>
                                            @昵称 啊
                                        </div>
                                    </div>
                                </li> -->
                            </ul>
                        </div>
                    </div>
                    <div class="liveing_c_r_tab_bd" style="display:none;">
                        <div class="msg" id="js_msg_talk">
                            <ul>
                            </ul>
                        </div>
                    </div>
                    <div class="liveing_c_r_tab_bd " style="display:none;">
                        <div class="msg" id="js_msg_qa">
                            <ul>
                                <!-- <li class="qa">
                                    <div class="msg_n"><img src="/logo.png"><span>昵称</span><span>讲师</span></div>
                                    <div class="msg_p">
                                        <div class="msg_c">啊</div>
                                    </div>
                                    <div class="qa_b" data-chatid="1" data-touid="1" data-toname="1" data-content="啊">
                                        <button>回复</button>
                                    </div>
                                </li> -->
                            </ul>
                        </div>
                    </div>

                </div>
                <div class="liveing_send">
                    <div class="msg_area">
                        <div class="shut_area">
                            <!-- <input type="checkbox" id="stopspeak" class="test">
                            <label for="stopspeak"> <span class="checkbox"></span>提问</label> -->
                            <input type="checkbox" id="putQuestions" class="test">
                            <label for="putQuestions"> <span class="checkbox"></span>提问</label>
                        </div>
                    </div>
                    <div class="send_area">
                        <textarea rows="3" placeholder="输入内容"></textarea>
                        <button type="button" id="js_send" data-type="0">发送</button>
                    </div>
                    
                </div>
            </div>
        </div>
    </div>
    <include file="student/public@scripts"/>
    <include file="public@xgjs"/>
    <include file="student/public@equipment"/>
    <script type="text/javascript" src="__STATIC__/agora/AgoraRTCSDK-3.0.1.js"></script>
    <script src="__STATIC__/swiper/swiper.min.js"></script>
    <script src="__STATIC__/js/socket.io.js"></script>
    <script src="__STATIC__/js/ajaxfileupload.js"></script>
    <script src="__STATIC__/emoji/emoji.js?t=1587286398"></script>
    <script src="__STATIC__/recorder/recorder.js"></script>
    <script>
        var rtc = {
            client: null, //上课房间初始化
            client_screen: null, //共享屏幕房间初始化
            joined: false, //是否进入上课房间
            joined_screen: false, //是否进入共享屏幕房间
            published: false, //是否推上课流
            published_screen: false, //是否推共享流
            localStream: null, //本地流
            localStream_screen: null, //共享流
            remoteStreams: [], //所有的上课异地流
            remoteStreams_screen: [], //所有的共享异地流
            params: {}, //上课用户信息
            params_screen: {}, //共享用户信息
        };

        //声网的一些信息
        var option = {
            appID: "{$info['sound_appid']}", //声网appid
            channel: "{$info['stream']}", //上课房间id，区分房间的唯一id
            channel_screen: 999999999, //共享房间id，区分房间的唯一id
            uid: "{$userinfo['id']}", //上课房间uid，用于推流的streamID
            uid_screen: 0, //共享房间uid，用于推流的streamID
            token: null
        }
        
        var _DATA = {};
        _DATA.userinfo={$userinfoj};//用户信息
        _DATA.roominfo={$infoj};//房间信息
        _DATA.teacherinfo={$teacherinfoj};//老师信息
        
        var courseid='{$info['courseid']}';
        var lessonid='{$info['lessonid']}';
        var stream='{$info['stream']}';
        var ppts={$info['pptsj']};
        var shutup_room = {$info['shutup_room']};
        var socket = new io("{$info['chatserver']}");
    </script>
    <script src="__STATIC__/student/js/event_liveing.js?t=1590716666"></script>
    <script src="__STATIC__/student/js/eventListen.js"></script>
    <script src="__STATIC__/student/js/liveing.js?t=1591079583"></script>
    
    
</body>
</html>
